/*
 * @Author: xiaosihan 
 * @Date: 2024-10-06 01:26:32 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-10-06 19:18:54
 */


import { autorun } from "mobx";
import { ReactNode, useEffect, useRef, useState } from "react";
import styles from "./improveInfo.module.less";
import { Steps } from "antd";
import factoryStore from "@views/factory/factoryStore";
import AccountInfo from "./AccountInfo/AccountInfo";
import CompanyInfo from "./CompanyInfo/CompanyInfo";
import MadeInfo from "./MadeInfo/MadeInfo";
import Introduce from "./Introduce/Introduce";

interface Iprops {
    children?: ReactNode
}
// 完善注册信息
export default function ImproveInfo(props: Iprops) {

    const dom = useRef<HTMLDivElement | null>(null);
    const [data, setData] = useState({});
    const [loginStatus, setLoginStatus] = useState(factoryStore.loginStatus);

    useEffect(() => {

    }, []);

    useEffect(() => autorun(() => {
        setLoginStatus(factoryStore.loginStatus);
    }, { delay: 10 }), []);

    return (
        <div
            ref={dom}
            className={styles.improveInfo}
        >
            <div className={styles.leftProgress} >
                <img className={styles.logo} src="./logo2.png" alt="" />
                <Steps
                    className={styles.steps}
                    direction="vertical"
                    current={["accountInfo", "companyInfo", "made", "introduce"].indexOf(loginStatus)}
                    items={[
                        {
                            title: '账号信息',
                            description: "团队和个人信息",
                        },
                        {
                            title: '公司信息',
                            description: "公司工商信息",
                        },
                        {
                            title: '制造能力',
                            description: "您团队的加工制造能力",
                        },
                        {
                            title: '市场简介',
                            description: "企业对外展示信息"
                        },
                    ]}
                />
            </div>
            <div className={styles.rightProgress}>
                {/* 账号设置 */}
                {loginStatus === "accountInfo" && <AccountInfo />}
                {/* 公司基本信息 */}
                {loginStatus === "companyInfo" && <CompanyInfo />}
                {/* 制造信息 */}
                {loginStatus === "made" && <MadeInfo />}
                {/* 简介 */}
                {loginStatus === "introduce" && <Introduce />}
            </div>
        </div>
    );

}